<template>
  <div>
    <div class="zk" v-if="nine_data.isShow">
      <div class="title aui-ftn18 aui-font-weight aui-text-red">
        <div class="line aui-bg-red"></div>
        9.9包邮
        <div class="line aui-bg-red"></div>
      </div>
      <van-row class="content">
        <section class="nine-article">
          <van-row>
            <van-col
              span="12"
              class="nine-list"
              v-for="(item, index) in nine_data.items"
              :key="index"
            >
              <List :item="item" :cid="''"></List>
            </van-col>
          </van-row>
          <!-- <div
            @click="fnInitNine()"
            class="aui-ftn14 aui-text-6 aui-text-center aui-padded-15"
            v-text="nine_data.text"
          ></div> -->
        </section>
        <!-- <van-list
          v-model="zk_data.loading"
          :finished="zk_data.finished"
          finished-text="没有更多了"
          @load="fnInitZk"
        >
          <van-col
            span="12"
            class="list"
            style="transform: translate3d(0, 0, 0)"
            v-for="(item, index) in zk_data.data"
            :key="index"
            @click="fnOpenProduct(item.id)"
          >
            <div class="list-cont aui-bg-f">
              <div
                class="good-img"
                :style="{ backgroundImage: 'url(' + item.image + ')' }"
                v-lazy="item.image"
              >
              <div class="all-red" v-if="item.all_red > 0">
                    <i class="iconfont icon-zijin"></i>
                    <span>+{{item.all_red}}</span>
                </div>
              </div>
              <div
                class="cont"
                style="transform: translateZ(0) translate3d(0, 0, 0)"
              >
                <div
                  class="name aui-text-3 aui-ftn14 aui-font-weight van-ellipsis"
                  v-text="item.name"
                ></div>
                <div class="tag aui-ftn12 aui-text-a" style="text-decoration: line-through;">
                  ￥{{ item.price }}
                </div>
                <div class="bt aui-margin-t-15">
                  <button
                    class="aui-btn aui-ftn13 aui-text-f aui-bg-red"
                  >去申请</button>
                  <div class="number aui-ftn12 aui-text-a">
                    <span>{{item.num - item.exitnum}}</span>人申请
                  </div>
                </div>
              </div>
            </div>
          </van-col>
       </van-list>  -->
      </van-row>
      <div
        class="aui-text-center aui-text-9 aui-ftn13 aui-padded-15"
        v-if="nine_data.loading && !nine_data.isTotal"
        v-cloak
      >
        —— 加载中 ——
      </div>
    </div>
  </div>
</template>

<script>
import "@/styles/discount.css";
import Discount from "@/service/discount.js";
import List from "../../discount/components/nine.vue";
// import home from "../../../service/home.js";
export default {
  data() {
    return {
      nine_data: {
        isShow: true,
        loading: false,
        finished: false,
        items: [],
        page: 0,
        disabled: false,
        refreshing: false,
        text: "数据加载中...",
      },
    };
  },
  components: {
    List,
  },
  props: ["random"],
  watch: {
    random(newValue, oldValue) {
      this.fnLoadMore();
    },
  },
  mounted() {
    this.fnInitNine();
  },
  methods: {
    fnLoadMore: function () {
      this.nine_data = {
        isShow: true,
        loading: false,
        finished: false,
        items: [],
        page: 0,
        disabled: false,
        refreshing: false,
        text: "数据加载中..."
      };
      this.fnInitNine();
    },
    fnInitNine() {
      let { loading, finished, items, isShow,text, page, disabled,refreshing  } = this.nine_data;
      if (!loading && !finished) {
        loading = true;
        page++;
        Discount
          .fnGetNineList({
            p: page, n: 20,cid: '', isToken: false, isLoading: true, type: 'nine'
          })
          .then((res) => {
            // 加载状态结束
            loading = false;
            if (res && Array.isArray(res.content)) {
                items = items.concat(res.content)
                text ="加载更多数据"
                
            } else {
              if (page == 1) isShow = false
                finished = true;
                text = '没有更多了'
            }
            this.nine_data = {loading, finished, page, items, text, disabled, refreshing, isShow};
          });
      }
    }
  },
};
</script>
<style>
</style>
